import React from 'react';
import { Main, YvMenu, Node } from 'yvan-ui-antd'

interface IProp {

}

interface IState {

}

const data: Node[] = [
    {
        key: 'a', value: '菜单1', icon: 'fa fa-bars',
        children: [
            {
                key: 'a1', value: '菜单1.1', icon: 'fa fa-bars',
                children: [
                    { key: 'a11', value: '菜单1.1.1', icon: 'fa fa-bars', href: './Module1' },
                    { key: 'a12', value: '菜单1.1.2', icon: 'fa fa-bars', href: './Module2' }
                ]
            },
            { key: 'a2', value: '菜单1.2', icon: 'fa fa-bars' },
            { key: 'a3', value: '菜单1.3', icon: 'fa fa-bars' },
        ]
    },
    {
        key: 'b', value: '菜单2', children: [
            { key: 'b1', value: '菜单2.1', icon: 'fa fa-bars' },
            { key: 'b2', value: '菜单2.2', icon: 'fa fa-bars' },
            { key: 'b3', value: '菜单2.3', icon: 'fa fa-bars' },
        ]
    },
    {
        key: 'c', value: '菜单3', children: [
            { key: 'c1', value: '菜单3.1', icon: 'fa fa-bars' },
            { key: 'c2', value: '菜单3.2', icon: 'fa fa-bars' },
            { key: 'c3', value: '菜单3.3', icon: 'fa fa-bars' },
        ]
    },
]

interface IRefs {
    main: Main
}

export default class MainWindow extends React.Component<IProp, IState> {

    onClick(node, { item, key, keyPath, domEvent }) {
        const that = this
        if (node && node.href) {

            const main = that.refs.main as Main

            if (!main.selectTab(node.key)) {
                import(node.href).then(res => {
                    main.addTab({
                        title: node.value,
                        key: node.key,
                        content: React.createElement(res.default, null)
                    })
                })
            }
        }
    }

    render() {
        return (
            <Main dataSource={data} onClick={this.onClick.bind(this)} ref="main" />
        );
    }
};